<template>
  <app-page card>
    <jax-form
      v-model="config"
      :json="formJson"
      :form-props="{ 'label-width': '105px' }"
      ref="form"
      :style="'max-width:450px'"
      @submit.prevent="handleSubmit"
    ></jax-form>
    <template #footer>
      <el-button type="primary" @click="handleSubmit">保存</el-button>
    </template>
  </app-page>
</template>

<script>
export default {
  mixins: [],
  data() {
    return {
      config: {},
      form: {},
    }
  },
  computed: {
    formJson() {
      const required = true
      const miniInput = { style: 'width:100px' }
      return [
        { name: 'title', label: '网站名称', required },
        { name: 'logo', label: '网站LOGO', type: 'uploadImage' },
      ]
    },
  },
  created() {
    this.$http(`/system/setting`).then(res => {
      this.config = {
        ...res,
      }
    })
  },
  methods: {
    handleSubmit(e) {
      if (e) e.preventDefault()

      this.$refs.form
        .validate()
        .then(val => {
          let config = {
            ...this.config,
          }
          delete config.configId

          this.$http
            .put(`/system/config/${this.config.configId}`, { config }, { showLoading: true })
            .then(res => {
              this.$message.success('保存成功')
              this.$store.dispatch('app/getConfig')
            })
        })
        .catch(erros => {
          console.log('erros', erros)
          this.$message.warning(valid)
        })
    },
  },
}
</script>

<style lang="scss" scoped></style>
